/**
 * Created by waifelee on 2016/12/25 0025.
 */
import React from 'react'
import Reflux from 'reflux'
import ReactMixin from 'react-mixin'

export default class  Weibo extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            textS :"",
            text :"",
            show : false
        }
    }
    handleChange() {
        this.setState({
            text: this.refs.text.value,
            textS:`还可以输入${this.showNum()}个字`
        });
    }
    showS(){
        this.setState({
            show:true
        })
    }
    unShowS(){
        this.setState({
            show: false
        })
    }
    showNum() {
        let  num = 140 - this.state.text.length;
        num = (num>0&&num <= 140)?num:0;
        return num
    }
    add(){
        this.setState.textS = "";
        this.refs.text.value = "";
    }
    render(){
        return(
            <div className="weiBo-contents">
                <div className="weiBo-contents-send">
                    <div className="weiBo-contents-send-title">
                        <p>有什么新鲜事要告诉大家</p>
                        {this.state.show &&
                        <span>{this.state.textS}</span>}
                    </div>
                    <div className="weiBo-contents-send-text">
                        <textarea ref="text"
                                  onChange={this.handleChange.bind(this)}
                                  onFocus={this.showS.bind(this)}
                                  onBlur={this.unShowS.bind(this)}>
                        </textarea>
                    </div>
                    <div className="weiBo-contents-send-btn">
                        <button onClick={this.add.bind(this)}>发布</button>
                    </div>
                </div>
            </div>
        )
    }
}

